<template>
  <view class="padding-bottom-20">
    <by-background />

    <by-navigation-bar :title="title"/>

    <view class="padding-lr-20">
      <template v-if="list.length">
        <by-list-card
            v-for="(item,index) in list"
            :key="item.uid + index"
            :item="item.technician"
            :type="type"
            :date="dateFormat(item.createTime,'YYYY年MM月DD日 hh:mm:ss')"
            :hasMenu="item.status"
            @show-menu="handleShowMenu(item.appointmentNo)"
            @showSafeguard="showSafeguard = true"
            @viewSubScribeDetail="jump(`/pages/subscribe/index?type=1&appointmentNo=${item.appointmentNo}&tno=${item.tno}${type === 'receive-subscribe' ? '&js=1' : ''}`)"
        />
        <by-load-footer :has-more="hasMore" text="加载中..." />
      </template>

      <by-nodata v-else />
    </view>
  </view>

  <by-page-dialogs v-model:show-safeguard="showSafeguard" />

  <by-dialog v-model="showDialg" title="温馨提示" content="请耐心等待对方联系" confirm-text="知道了" :show-cancel="false"/>

  <by-draw-bottom v-model="showMenu" :watch-back="false" :list="menuList" @click="handleClick"/>
</template>

<script setup lang="ts">
import {
  userGetServiceAppointment,
  technicianGetServiceAppointment,
  userDeleteServiceAppointment,
  technicianDeleteServiceAppointment
} from '@/common/api'
import { dateFormat, GetList, jump, toast } from '@/common/util'
import type { AnyObject, IGetList } from '@/common/types'

const showMenu = ref(false)
const showSafeguard = ref(false)

const title = ref('')
const type = ref('')
const showDialg = ref(false)
onLoad((e) => {
  title.value = e?.type ? '收到预约' : '我的预约'
  type.value = e?.type ? 'receive-subscribe' : 'subscribe-history'
  const api = e?.type ? technicianGetServiceAppointment : userGetServiceAppointment
  getList = new GetList(api, {}, res => res.records)
  reload()
})

const menuList = [
  { text: '删除记录' }
]

let appointmentNo:string
function handleShowMenu(id:string) {
  showMenu.value = true
  appointmentNo = id
}

async function handleClick() {
  if (type.value === 'subscribe-history') {
    await userDeleteServiceAppointment({ appointmentNo })
  } else {
    await technicianDeleteServiceAppointment({ appointmentNo })
  }
  reload()
  toast('操作成功')
  showMenu.value = false
}

/* 获取列表*/
const hasMore = ref(true)
const list = shallowRef<AnyObject[]>([])
let getList:IGetList<AnyObject, AnyObject>
async function reload() {
  list.value = await getList.reload()
  hasMore.value = getList._has_more
}
async function nextPage() {
  hasMore.value = getList._has_more
  list.value.push(...await getList.nextPage())
  triggerRef(list)
}
onPullDownRefresh(reload)
onReachBottom(nextPage)
</script>

<style scoped lang="scss">

</style>
